<template>
	<view class="page">
		<cu-custom bgColor="bg-gradual-red" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">{{title}}</block>
		</cu-custom>
		<Loading class="loading" v-show="!isLoading" :isStatus='loadStatus'></Loading>
		<HongBao class="hongbao"></HongBao>
		<PlayVideo v-if='showVideo' @Vclose="closePop" class="playVideo" :url='videoUrl'></PlayVideo>
		<RedPack class="packBox" ref="RedPack" @changeStatus="changeStatu" :dat="redPackData"></RedPack>
		<Coupon  class="couponBox animation-slide-bottom" :style="{height:bodtyH}" @selectConpon='isCouponMeth' :conponId="conponId" :type="true" v-if="isCoupon"></Coupon>
		<BaoMing class="baomingBox animation-slide-bottom" v-if="isStatus && isLoading" @closeBaoMing='closeBaoming' @selectConpon1='openConpon' ref="changeBaoming"
		 :goodData='good' :courseIdd='courseId' :style="{height:bodtyH}"> </BaoMing>

		<scroll-view scroll-x class="bg-white nav tabBox" v-if="isShowTab">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="item.type==TabCur?'text-orange cur':''" v-for="(item,index) in tapType" :key="index"
				 @tap="tabSelect" :data-id="item.type" :data-type='item.type'>
					{{item.name}}
				</view>
			</view>
		</scroll-view>
		<scroll-view scroll-y class="goodBox"  v-show="isLoading" :style="{height:bodtyH}" @scroll="gundong" :scroll-top="scrollP">
			<view class="zhanshiBox animation-slide-bottom" :style="[{animationDelay: (0 + 1)*0.1 + 's'}]">
				<swiper class="swiper" :indicator-dots="indicatorDots" :interval="interval" :duration="duration" id="goodId">
					<swiper-item v-for="(item,index) in good.advertmap">
						<view class="swiperBox">
							<image v-if="item.type==='image'" :src="item.url" mode="aspectFill" class="lunboImg"></image>

						</view>
					</swiper-item>
				</swiper>
				<CountDown class="cuntDown" ref="child" @countDown='updateTime' :endTime='good.end_time' v-if='isLoading'>
				</CountDown>

			</view>
			<view class="goodBox1 animation-slide-bottom" :style="[{animationDelay: (1 + 1)*0.1 + 's'}]">
				<view class="goodName">

					{{good.title}}
				</view>
				<view class="goodName1">
					{{good.intro_detail}}
				</view>
				<view class="priceBox">
					<view class="priceFu">
						￥
					</view>
					<view class="priceShuzi ">
						{{good.price}}
					</view>

					<view class="verticalLine">
					</view>

					<view class="kucun">
						已报名 {{good.enrollment}}人
					</view>
				</view>
				
				<view class="goodName-html" v-html="good.basic_info">
				
				</view>
				<view class="priceMsg" v-show="!over">

					<view class="priceBox1">
						<text class="lg text-gray cuIcon-notification"></text>
					</view>
					<view class="msgList" :class="{'animation-slide-bottom':isMsgopen}" v-html="msgList[msgIndex].msg">
					
					</view>

				</view>

				<view class="butBox" v-if="!over">
					<button class="cu-btn round bg-orange" open-type="share" v-if="good.signed==1" style="font-size:4vw;">邀好友报名得红包</button>
					<button class="cu-btn round bg-orange" @click="baoming()" v-if="good.signed!=1" style="font-size: 4vw;">立即报名</button>

				</view>
				<view class="tishi" v-html="good.tips">
				
				</view>


				<RedList @CredPack='openRed' class="redBox" :hongBao="good.hongbaoList" v-if="good.hongbaoList && !over" :rule="good.rule"  ref="changestatus" ></RedList>
				
				<view class="red-rule-box" v-html="good.rule" v-if="!over">
				
				</view>

			</view>
			<view class="cu-bar justify-center bg-white" id="introduceId">
				<view class="action border-title">
					<text class="text-xl text-bold text-blue">详情介绍</text>
					<text class="bg-gradual-blue" style="width:3rem"></text>
				</view>
			</view>
			
			
			
			<u-parse :content="introduce" @preview="preview"  />

			<view class="footBox" :style="{height:footH+'px'}">

			</view>
		</scroll-view>


	</view>
</template>
<script src="./home.js"></script>
<style>
	@import "home.css";
</style>
